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CAPÍTULO 12 


JAVASERVER FACES 


Um grande problema existente no desenvolvimento de aplicações Web diz respeito a 
característica stateless do protocolo HTTP: a cada nova requisição, o estado da interface com 
o usuário é totalmente perdido. 

Repare que isso simplesmente não ocorre em uma aplicação Desktop: os valores 
contidos nos componentes visuais estão na memória do computador e, quando você clica em 
um botão, os dados anteriores são mantidos em seus respectivos campos não havendo 
necessidade de "reconstruir" novamente a Interface. 

Além disso, no desenvolvimento de aplicações com Visual Basic ou €C Sharp, podemos 
editar as propriedades do componente, como na figura seguinte: 





Properties "0X 


Forml System windovys.Forms.For 


SIENA 


Padding 0 0: 0: 0 
RightToLeFt No 
RightToLeftLay False 
ShowIcon True 
ShomwInTaskbar True 
Size SO; SO 
SieGripotyle duto 
StartPosition yindomsDefaulkL 
Tag 

Formi 
TopMost False 
TransparencyE [1] 
Usemvaitoursor False 
windomstate Normal 


Text 
The text associated with the control, 





Desta forma, cada componente tem seu conjunto de propriedades e toda interface 
gráfica com o usuário é feita através da associação de valores a este conjunto de 
propriedades dos componentes visuais. 


12.1. FRAMEWORKS 





Hoje em dia, é improvável que uma empresa decida começar um projeto Java 
utilizando diretamente HTML e JavaScript, pois a produtividade é pequena e a 
manutenção é dificil. Por isso bibliotecas que definem um modelo de programação baseado 
no padrão MVC são utilizadas nos projetos. Essas bibliotecas são os chamados Frameworks 
Web e os mais populares são JSF, Struts, Spring e VRaptor. Podemos considerar um 
framework como uma solução para um conjunto de problemas em comum, com uso de 
classes e interfaces, que disponibilizam objetos com capacidade de capturar funcionalidades 
comuns a várias aplicações. 


12.2. JAVASERVER FACES 





ENA E = = n“nanao 114 


ESCOLA TÉCNICA ESTADUAL PROFESSOR Material do Curso Técnico em Informática 
HORÁCIO AUGUSTO DA SILVEIRA Desenvolvimento de Software I 





Java Server Faces, também conhecido como JSF, é uma tecnologia para 
desenvolvimento web que permite criar aplicações Java utilizando componentes visuais, 
fazendo com que o desenvolvedor não se preocupe com Javascript e HTML. Basta adicionar 
os componentes (calendários, tabelas, formulários) que os mesmos serão atualizados e 
exibidos em formato HTML. Além disso, o estado dos componentes é sempre guardado 
automaticamente, fazendo o papel de Stateful, permitindo criar até wizards e navegar em 
vários passos com o estado das telas sendo mantidos, sem ter de resgatá-los novamente. 

O JSF é baseado no padrão de projeto MVC (Model-View-Controller), o que torna 
desenvolvimento de sistemas menos complicado, pois é clara a separação entre a 
visualização e regras de negócio. 

Em JSF, a camada de visualização é responsável pela interação com o usuário e é 
composta por árvore de componentes, o que torna possível unir componentes para construir 
Interfaces mais ricas e complexas. O controle é composto por um servlet denominado 
FacesServlet, por arquivos de configuração XML e por um conjunto de manipuladores de 
ações e observadores de eventos. O FacesServlet recebe as requisições da WEB, redireciona 
estas para o modelo e envia uma resposta. Os manipuladores de eventos são responsáveis 
por receber os dados vindos da camada de visualização, acessar o modelo e devolver o 
resultado para o FacesServlet. O modelo representa os objetos de negócio e executa uma 
lógica de negócio ao receber os dados vindos da camada de visualização. 

A figura seguinte mostra a arquitetura do JavaServer Faces baseada no modelo MVC. 


Õ 


INTERNET/NTRANET APP SERVER 





DIFFERENT | ps E 
TYPES - ; “5; ME 
OF CLIENTS Ed 





O ponto forte do JSF está em abstrair a complexidade da comunicação cliente-servidor 
(HTTP request e response). Esta abstração foca no desenvolvimento direcionado a 
componentes, com propriedades que podem ser configuradas e eventos que podem ser 
capturados, tornando a etapa de implementação mais intuitiva e produtiva. 

O desenvolvimento com JSF é baseado em componentes, que possuem uma ligação 
direta com a aplicação, porém, cada um deles pode ter um papel diferenciado na mesma. 
Este papel pode estar associado à visibilidade que cada componente (managed bean) precisa 
ter em relação à aplicação. Esta visibilidade, que determina quais componentes podem 
manter uma associação entre si dentro de um determinado contexto, é conhecida como 
escopo de acesso. Desta forma, faz-se necessária a compreensão dos diferentes tipos de 
escopo que podem ser atribuídos aos managed beans que compõem a aplicação. 
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12.3. PRINCIPAIS COMPONENTES 


O verdadeiro poder do JSF está na construção de interfaces com o usuário usando um 
conjunto de componentes pré-construídos, ao invés de criar Interfaces inteiramente do zero, 
que podem ser renderizados em diversas formas e para vários tipos de clientes como, por 
exemplo, para um browser da web, celular, etc., oferecendo alta produtividade aos 
desenvolvedores. 

Existem vários componentes de visualização JSF, desde os mais simples, como um 
outputLabel, que apresenta simplesmente um texto, ou um dataTable, que representa 
dados tabulares de uma coleção que pode vir do banco de dados. A especificação do JSF 
inclui, em sua implementação de referência, duas bibliotecas de componentes: a “HTML”, 
que possui componentes que representam diversos elementos HTML e a biblioteca “Core”, 
que é responsável por tarefas comuns no desenvolvimento de sistemas, como tratamento de 
eventos, Internacionalização, validação e conversão de dados de entrada. 

Os principais componentes que a implementação de referência do JSF fornece são: 

“« Formulário 

= (Campos de entrada de texto 
= (Campo de entrada de senha 
« Rótulos com textos 

= Textos de uma única linha 
= Links 

« Botões 

« Mensagens 

= Painéis 

“ Tabela HTML 

« Tabela de dados (grid) 

= Coluna de tabela de dados 


12.4. COMPONENTES ADICIONAIS 





Em sua implementação de referência, o JavaServer Faces traz uma série de 
componentes prontos para uso, porém, através da extensibilidade oferecida, novos 
componentes também podem ser criados — além de haver a possibilidade do uso de uma 
implementação de terceiros. 

Atualmente existem diversas empresas que trabalham na criação de componentes 
personalizados como, por exemplo, a Oracle com o ADF Faces Rich Client, IceSoft com o 
IceFaces e o JBoss (Redhat) com o Richfaces. Muitos desses componentes incluem múltiplos 
renderizadores para diversos tipos de clientes, tabelas avançadas, componentes para 
captura de datas e cores, menus suspensos, botões, barras de progressão, telas suspensas 
para seleção de valores e etc. 

Veja abaixo um exemplo de sistema usando a biblioteca de componentes IceFaces: 
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12.5. ESPECIFICAÇÃO JSF 





O JSF foi criado através do Java Community Process (JCP), que é uma entidade 
formada pelas mais importantes empresas de tecnologia do mundo e especialistas em 
diversos assuntos. O JCP é composto por vários grupos de trabalho, que são chamados de 
JSR (Java Specification Request). Uma JSR é um projeto de uma nova tecnologia que 
propõe documentações, interfaces e algumas classes que especificam como deve funcionar 
um novo produto que, quando finalizado, empresas fornecedoras de tecnologia têm a chance 
de entender e implementar um produto final compatível com o proposto pela especificação. 

No caso da JSF, as implementações mais conhecidas atualmente são a da própria Sun, 
conhecida como Mojarra, e a da Apache, chamada de MyFaces Core. Todas as 
implementações devem fazer a mesma coisa, mas o que diferencia uma da outra é a 
qualidade de desenvolvimento do produto, documentação disponível, suporte oferecido pela 
empresa e principalmente pela comunidade, etc. 

Usaremos a implementação da Sun, a Mojarra, e pode ser encontrada em: 
https:/javaserverfaces.dev.java.net/. O suporte nativo ao JSF 3 foi adicionado ao Eclipse na 
versão 3.6 (Eclipse Helios) e as versões anteriores não possuíam um bom modo de trabalhar 
com os arquivos facelets. 





O World Wide Web Consortium (W30) é um consórcio de empresas de tecnologia, 
fundado por Tim Berners-Lee em 1994, para levar a Web ao seu potencial máximo, por meio 
do desenvolvimento de protocolos comuns e fóruns abertos que promovem sua evolução e 
asseguram a sua Interoperabilidade. 
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O W3C€ desenvolve padrões para a criação e a Interpretação dos conteúdos para a Web. 
Sites desenvolvidos segundo esses padrões podem ser acessados e visualizados por qualquer 
pessoa ou tecnologia, independente de hardware ou software utilizados de maneira rápida e 
compatível com os novos padrões e tecnologias que possam surgir com a evolução da 
Internet. 

Para alcançar seus objetivos, a W30C possui diversos comitês que estudam as 
tecnologias existentes para a apresentação de conteúdo na Internet e criam padrões de 
recomendação para utilizar essas tecnologias. Com a padronização, os programas 
conseguem acessar facilmente os códigos e entender onde deve ser aplicado cada 
conhecimento expresso no documento. 





XML, do inglês eXtensible Markup Language, é uma linguagem de marcação 
recomendada pela W3C para a criação de documentos com dados organizados 
hierarquicamente, tais como textos, banco de dados ou desenhos vetoriais. A linguagem 
XML é classificada como extensível porque permite definir os elementos de marcação. 

O XML traz uma sintaxe básica que pode ser utilizada para compartilhar informações 
entre diferentes computadores e aplicações. Quando combinado com outros padrões, torna 
possível definir o conteúdo de um documento separadamente de seu formato, tornando 
simples para reutilizar o código em outras aplicações para diferentes propósitos. 

Portanto, uma das suas principais características é sua portabilidade, pois, por 
exemplo, um banco de dados pode escrever um arquivo XML para que outro banco consiga 
lê-lo. 

Alguns dos propósitos do XML são: auxiliar os sistemas de informação no 
compartilhamento de dados (especialmente via internet), codificar documentos e inserir 
seriais nos dados comparando o texto com o de outras linguagens baseadas em serialização, 
simplicidade e legibilidade das informações (tanto para humanos quanto para 
computadores), possibilidade de criação de tags sem limitação, criação de arquivos para 
validação de estrutura e Interligação de bancos de dados distintos. 


Exemplos de Código AML 


<?xml verston="1.0" encoding="150-8859-1"7> 
<cd> 

<titulo>Death Magnetics/titulo> 
<artista>Metallica</artista> 

<ano>2008</ano> 

</cd> 


<?xml version="1.0" encoding="iso-8859-1"2> 
<receita nome="Pão Caseiro" tempo de preparo="10 minutos” tempo assar="40 minutos"> 
<titulo>Pão Caseiro Simples</titulo> 
<ingredientes> 
<ingrediente quantidade="3" unidade='xicaras">Farinha</ingrediente> 


<ingrediente quantidade="7" unidade="gramas">Fermentos</ingrediente> 
<ingrediente quantidade="1" unidade="xicaras" estado="morna">Agua-</ingrediente> 
<ingrediente quantidade="1" unidade="xicaras">Açúcars/ingrediente> 
<ingrediente quantidade="1" unidade="colheres de chá">Sals/ingrediente> 
</ingredientes> 
<instrucoes> 


<passo>Misture o fermento com o açúcar e espere aproximadamente cinco minutos.</passo> 
<passo>Misture todos os ingredientes, e dissolva bem.</passo> 
<passo>Cubra com um pano e deixe por uma hora em um local morno.</passo> 
<passo>Misture novamente, modele o formato e coloque na forma. Asse em forno médio.</passo> 
<finstrucoes> 
</receita> 
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12.8. XHTML 








XHTML (eXtensible HyperText Markup Language) é uma recomendação do W3€C 
desde 26 de Janeiro de 2000, o que implica dizer que sua especificação é estável, foi 
revisada pelos membros do W30 e agora é um padrão Web. 

XHTML é compatível com a HTML 4.01, sendo uma reformulação da HTML 4.01 em 
XML (eXtensible Markup Language), ou seja, consiste de todos os elementos da HTML 4.01 
combinado com a sintaxe do XML. Considere o seguinte documento HTML: 


<title>HIML mal-formado</title> 
PS ER 


<body> 
<b><u>Exemplo de documento HIML mal-formado <'b> </fu> 
açao, nega aaa açao, aaa faça aaa aaa ao aaa, a a a a o a a ça 
<body> 


Apesar de ser mal-formado - na medida em que nem todos os elementos estão fechados 
e aninhados -, ele será corretamente exibido nos navegadores utilizados em PC, tais como 
Internet Explorer e Firefox. 

O exemplo demonstra o quanto o HTML é tolerante em termos de sintaxe. Entretanto 
os navegadores que rodam em dispositivos portáteis, como telefones celulares e palmtops, 
não possuem muitos recursos e poder para processamento de documentos web mal- 
formados. Pode-se dizer então que o principal propósito da XHTML é garantir a 
acessibilidade de páginas web a partir de qualquer dispositivos. 


12.9. DECLARAÇÃO DOCTYPE 





Declaração que especifica a linguagem de marcação usada no documento, isto é, 
determina a DTD (Document Type Declaration) daquela linguagem. Uma DTD especifica 
as regras que definem um padrão ou formato. Define também os elementos, atributos e 
valores permitidos, além das condições de encadeamento e sua ocorrência. 

Como descreve a sintaxe e a gramática da linguagem de marcação, a declaração 
DOCTYPE deve ser a primeira declaração em um documento XHTML. 


12.10. IMPORTAÇÃO DE TAGS 





Às telas das aplicações JSF podem ser definidas através de arquivos .xuTML. Esses 
arquivos são processados pela engine do Facelets que faz parte do JSF. 

Como o JSF é baseado em componentes que são usados como tags na nossa aplicação e, 
como vimos antes, devemos definir dois conjuntos principais de tags: a core e a HTML. 
Para importá-las, basta declará-los como namespace XML no arquivo .xHTML: 


“html xmlns="http://vrr.r3.0rg/1999/xhtml" 
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12.11. FORMULÁRIOS 





O uso de formulários é comum em qualquer sistema web, usando qualquer tecnologia. 
O framework JSF possui um componente para renderizar formulários HTML chamado 
<H: FORM>. 


<h: form> 


-- campos do formulário aqui... 


a ça Pe e 


<fh: form> 


À tag <H:rorm> gera um elemento form da HTML. Apesar da tag <rorm> da HTML 
possuir os atributos METHOD e ACTION, à tag <u:rorm> do JSF não possui, pois sempre é 


considerado o método “post” e a ação igual ao endereço da mesma página, como você pode 
ver no código gerado. 


12.12. APLICAÇÃO DE EXEMPLO 





Iremos montar uma pequena aplicação em JSF 2 que exiba o novo valor de um 
Investimento com base no valor investido e no tipo de investimento. Como utilizaremos 
facelets, a nossa página estará em um arquivo com a extensão .xhtml. 


Como todo arquivo HTML, tudo que será renderizado pelo navegador deve ficar dentro 
de tags. Utilizaremos a tag <H:graD> para definirmos o cabeçalho da página contendo o 
título desta e a tag <H:BoDY> para colocarmos o conteúdo de nossa página. 


<h:head> 
<title>-Calcule o rendimento</title> 
A a aa a a ta ço 


</fh:head> 


<h: body> 


Para fazermos a inserção dos dados, precisaremos de um formulário com os campos 
necessários. O próximo passo é delimitar os campos que irão compor o formulário, 
utilizando a tag <H: FORM>. 

Os componentes de entrada de dados e também os que permitem comandos (ações) dos 
usuários (como os botões e links) sempre devem estar dentro da tag <H: ForM>, polis assim os 
valores digitados pelos usuários nos campos e os estímulos aos comandos podem ser 
enviados para o servidor fazer o processamento. 

O componente <g: outpUTLABEL> renderiza o elemento label da HTML. Os componentes 
<H: OUTPUTLABEL> são vinculados com outros através do atributo for. O uso deste componente 
é justificado para rotular principalmente campos de seus formulários. 
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<h:body> 
<h: form> 





<fh: Fform> 
<fh:body> 


O componente <u: INpUTTIEXxT> renderiza um campo de entrada de texto simples, 
representado pelo elemento input do tipo “text” da HTML. 


<h: inputText id-"valor"/> 


O componente <H: seLecTONEMENU> renderiza um menu de seleção única, representado 
pelo elemento select da HTML, com o atributo s1zz igual à 1 e sem o atributo muLTIPLE, que 
permitiria seleções múltiplas. A maioria das tags de seleção devem receber a relação de 
Itens que aparecerão na lista. Para especificar os Itens, usamos a tag fundamental 
<F: SELECTITEM>. 


<h: selectôneMenu id="tipo"> 
<f:selectItem itemValue="poupanca" itemlabel="Poupan&ccedil;a"/> 
<«f:selectItem itemvValue="renda"” itemLlabel="Renda Fixa"/> 

<ih: selecrtôneMenu> 


Qualquer aplicação web precisa de botões e links para receber as ações do usuário. O 
componente <H: commaNDBUTTON> gera um elemento input da HTML do tipo suBmIT, IMAGE OU 


RESET. O atributo type pode ser especificado com susmir (padrão) ou RESET. 


<h: commandButton value="Calcular"/> 


Caso executemos este arquivo, o resultado será um formulário com todos os campos em 
uma única linha: 


“ Calcule o rendimento 25 a H 
ai? http://localhost:&080/ds2 -jsf/investimentos.xhtml - 


“ Calcular | 





Valor atual: Tipo: Poupança + 


O framework JSF possui componentes que te ajudam a organizar seus layouts. O 
componente <H:PANELGRID> renderiza uma tabela da HTML. Ele funciona como um 
organizador de itens no layout da página e pode acomodar qualquer componente JSF. 
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<h:panelGrid colums="2"> 


<fh:panelGrid> 


À tag <H: PANELGRID> organiza os componentes dentro do painel em tabelas contendo o 
número de colunas que você determina no atributo coLumns. 


“ Calcule o rendimento 25 2 E 


E «> http://localhost:8080/ds2-jsf/investimentos.xhtml "| 





Tipo: Poupança 


Calcular | 


Os componentes simples de entrada de dados disponíveis no JSF são: 


input Text Horacio 
inputSecret veses 
inp mtTexiarea Horacio ã 


seleciBooleanCheckbox |4 


selectQOneMemm Opção? - 
selectUneRadio o Masculino Feminino 





12.13. EXERCÍCIOS: JavaServer Faces 





1) No Echpse, crie um novo projeto web: 

Acesse o menu File > New 9 Project. 

Selecione Web > Dynamic Web Project e clique em Next. 

Em Project Name, coloque dsl-jsf. 

Selecione como Target Runtime a versão do Tomcat que acabamos de configurar: 
Na seção Configuration, clique em Modify para acrescentarmos suporte ao JSF. 


Re o e 
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Target runtime 


New Runtime... 


Dynamic web module version 


23 - 


Configuration 









Default Configuration for Apache Tomcat vô. 





À quod starting point for working with Apache Tomcat vô.0 runtime. Additional face 
installed to add new functionality to the project. 


e. Na tela que abre, marque a opção JavaServer faces e versão 2.0, depois clique em 


Ok. 


(A Project Facets 


Project Facets 
Select the facets that should be enabled for this project. 


Configuration: | <custom> -|| Save Ás... | | Delete | 


Project Facet Verston Details Runtimes, 
» [E] E] Axis2 Web Services E) Axis2 Web 
[D| E) CAF 2x Web Services LD Services 
Fl é» Dynamic Web Module 25 = 
PART tavá 16 Eres Ma 
st sa services 
4) =| Javaberi LO generation 
[| |=| JavaServer Faces through the Axis? 
| E JAA-RS (REST Web Services) Web services 
| 4» JPA 7 engine, 
Cl is WebDoclet (XDoclet) 





























f. Na tela de criação, clique em Next três vezes até chegar à tela de configurações do 
JSF. Em Type, selecione a opção Disable Library Configuration, indicando ao 
Eclipse que nós mesmos vamos copiar os JARs do JSF. 


JSF Implementation Libra 





This facet requires JSF implementation library to be present on project classpath. By disabling library 
configuration, user takes on responsibility of configuring classpath appropriateby via alternate means. 


g. Ainda nessa tela, em URL Mapping, remova o mapeamento /faces/* e adicione 
um novo mapeamento como * .xhtml. 
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2) 


9) 


4) 


J5F Configuration File: | ANWEB-INFMaces-configem! 


JSF Servlet Name: Faces Servlet 


J5F Servlet Class Name: javaxfaceswebapp.FacesServlet 


URL Mapping Patterns: 


Remove 





h. Clique em Finish para criar o projeto. 


Crie os pacotes necessários à sua aplicação: 
a. Acesse a pasta Java Resources/src 
b. Clique com o botão direito em src e escolha New > Package 


c. Digite o nome: br.com.etec. jsf.modelo 
d. Clique em Finish 
e. Crieo pacote br.com.etec. jsf.mb, conforme figura abaixo: 


di Es Java Resources 
4 [E src 
E4 br.com.etec,jsfimb 
E4 br.com.etec,jsfimodelo 


Precisamos da classe de modelo necessário para o projeto conhecida como JavaBeans, 
ou seja, uma classe com todos os atributos privados, seus getters e setters e um 
construtor vazio (padrão). 

a. No Eclipse, clique com o botão direito no pacote br. com.etec. jsf.modelo 

b. Escolha a opção New > Class 

c. Coloque como nome de classe Investimento e clique em Finish 

d. Declare os atributos e getters e setters da classe abaixo: 


Investimento 


- valor : double 


- tipo : String 





Vá até a pasta JSF-JARS no moodle e copie o conteúdo da pasta para dentro da pasta 
WEB-INF/11ib do projeto. 


a. Clique com o botão direito em wWebContent, acesse a opção New =D Other 
b. Escolha Web D HTML File e coloque o nome de investimentos.xhtml 


c. Clique em Next 


Ooo unfntas! BZ 
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d. Selecione a opção New XHTML File (1.0 transitional). Essa opção define um 
Doctype XHTML que admite uso de elementos obsoletos e regras de apresentação 
embutidas em tags. 


RH) New HTML File gg cs E 
select HTML Template 
Select a template as initial content in the HTML page. 


| Use HTML Tem plate 
E 


mplates: 


Name Description 


xhtml 1,0 frameset 


<?xml version="1.0" encoding-"5S/encoding!" ?> 

PE html PUBLIC "-//W3C//DID XHIML 1.0 Transiticl d 
<hteml xmins="htto://vrvr.v3.0rg/1999/xhtml"> 
<head> e 
4| E | k 





Templates are New HTML templates found in the HTIAL Templates preference page. 








mem 





e. Clique em Finish. 


5)  Importe as tags coree HTML para sua página. Utilize a tag <urmL> de sua página: 


<*mml vergsion="1.0" encoding "I50-6859-1" 2% 
<IDOCTIYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 


<html xmlns="http://vvrr.v3.0rg/1999/xhEml" 


xmins:f="http://java.sun.com/]sf/core" 
zmins:h="http://java. sun. com/]sf/hEml "> 





<head> 

<meta http-equiv="Content-Tyvpe" content="text/html; charset=ISÍ 
<«title>Insert title here</title> 

<head> 

<body> 


<'body> 
<html> 


6) Substitua as tags <HEAD> e <BoDy> pelas respectivas tags <H: HEAD> e <H:BoDY> do JSF: 


, 
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“amil version="l.0" encoding "ISO-GEs9-I” 2% 

<IDOCIYTPE html PUBLIC "-//W3C//DTID XHTIML 1.0 Transition: 

<html xmins="http://vrr.v3.0rg/1999/xhEml" 
amins:f="http://gava.sun.com/gsf/core" 
xmins:h="http://gava. sun. com/9sf/hEml "> 





<meta http-equiv="Content-Tyrpe” content="text/html; 
<“title>Insert title here</title> 





<html> 


7) Altere o título (tag <rITLE>) da página .xHTML: 


<h:head> 
<meta http- CS ES content="text/html; charset=IS0-GEsB9-I” /> 





</h:head> 
8) Dentro do <H:Bony> acrescente um formulário com os componentes a seguir: 


<h: form> 


<h: outputLabel value="Valor atual:" for="valor" /> 
<h: inputText id="valor"/> 


<h: outputLabel value="Tipo:" for="tipo” /> 
<h: selectôneMenu id="tipo"> 
<f:selectItem itemValue="poupanca" itemLabel="Poupan&ccedil;a" > 
<f:selectItem itemValue="renda" itemlabel="Renda Fixa” /> 
<'h: selectOneMenu> 
<h: commandButton value="Calcular"/> 
<fh: Fform> 


9) Salve o arquivo e execute a página através da URL: http:/Jocalhost:8080/ds1- 
Isffinvestimentos.xhtml] 
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10) Para organizar os componentes dentro do formulário usaremos o pANELGRID, definindo 
a organização em 2 colunas: 


<h: form> 





<h: outputLabel value="Valor atual:" for="valor" /> 
<h: inputText id="valor"/> 


<h: outputLabel value="Tipo:" for="tipo" /> 

<h: selectôneMenu id="tipo"> 
<«f:selectItem itemValue="poupanca" itemLlabel="Poupan&ccedilsa” /> 
«f:selectItem itemValue="renda" itemlabel="Renda Fixa” /> 


<'nh:selectâneMenu> 


<h: commandButton value="Calcular"/> 





</fh: Fform> 


11) Salve o arquivo e execute novamente a página através da URL: 
http://localhost:8080/ds1-jsf/investimentos.xhtml. O resultado será: 
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12.14. RECURSOS JSF 





JavaServer Faces é muito mais do que apenas componentes de interface com o 
usuário. Este framework oferece diversos outros serviços para o desenvolvimento da 
camada visual de sua aplicação, tais como: 

« Conversão de dados: facilita a conversão de textos digitados pelos usuários para 
tipos específicos, como por exemplo, quando o usuário digita sua data de nascimento, 
o servidor recebe um texto, que deve ser convertido para um objeto do tipo Date 
representando o que o usuário informou. 

« Validação: diversas validações de dados básicas podem ser feitas antes de suas 
regras de negócio ser executadas, como, por exemplo, sobre obrigatoriedade de 
campos, aceitação de apenas números ou validação de documentos, como CPF e 
CNPJ. 

« (Componentes customizados: você pode criar ou baixar da internet componentes 
customizados para enriquecer o desenvolvimento de suas aplicações. Os componentes 
podem ser reutilizados em todas as aplicações de sua empresa, e o designer das 
páginas não precisa conhecer como ele foi feito para utilizá-lo. Por exemplo, você 
poderia criar um componente para exibir um teclado virtual para digitação de 
senhas. 

« Renderizadores: o JSF gera código HTML por padrão, porém o framework suporta 
a inclusão de outros renderizadores plugáveis que podem produzir códigos em outras 
linguagens para visualizadores de diferentes tipos, como celulares (WML), Telnet, 
Flash, etc. 

« Internacionalização: com JSF, é muito fácil você desenvolver aplicações multi- 
Idiomas com o recurso de 118n (abreviação para Internacionalization). 
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